<template>
  <van-skeleton title :row="8" :loading="!isLoadFinish">
    <div class="app-container" style="padding: 0px;">
      <DraggableItem
        ref="mobilePageRender"
        v-for="(element, index) in pageBuildConfig"
        :key="element.buildKey+nowRenderKey+index"
        :name="'my-component-' + element.formId"
        :drawing-list="pageBuildConfig"
        :element="element"
        :index="index"
        :form-conf="pageConfig"
        @evalEventCode="evalEventCode"
        @changeFormData="changeFormData"
        :visitType="visitType"
        :loadMode="loadMode"
      />
    </div>
  </van-skeleton>
</template>

<script>
import { PageMixins } from '@/views/youshuda/base/mobile/mixins/PageMixins'

export default {
  mixins:[PageMixins],
  props: {
    visitType:  {
      type: String,
      default: 'Mobile'
    },
    loadMode:  {
      default: ''
    },
  },
  name: 'MobilePageRender',
  created() {
    let userAgent = navigator.userAgent;
    if (userAgent.indexOf('AlipayClient') > -1) {
      // 支付宝小程序的 JS-SDK 防止 404 需要动态加载，如果不需要兼容支付宝小程序，则无需引用此 JS 文件。
      this.loadScript("https://appx/web-view.min.js","alipay")
    } else if (/QQ/i.test(userAgent) && /miniProgram/i.test(userAgent)) {
      // QQ 小程序
      this.loadScript("https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js","QQ")
    } else if (/miniProgram/i.test(userAgent) && /micromessenger/i.test(userAgent)) {
      // 微信小程序 JS-SDK 如果不需要兼容微信小程序，则无需引用此 JS 文件。
      this.loadScript("https://res.wx.qq.com/open/js/jweixin-1.4.0.js","weiXian")
    } else if (/toutiaomicroapp/i.test(userAgent)) {
      // 头条小程序 JS-SDK 如果不需要兼容头条小程序，则无需引用此 JS 文件。
      this.loadScript("https://lf1-cdn-tos.bytegoofy.com/goofy/developer/jssdk/jssdk-1.2.0.js","bytegoofy")
    } else if (/swan/i.test(userAgent)) {
      // 百度小程序 JS-SDK 如果不需要兼容百度小程序，则无需引用此 JS 文件。
      this.loadScript("https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.18.js", 'baiDu')
    } else if (/quickapp/i.test(userAgent)) {
      // quickapp
      this.loadScript("https://quickapp/jssdk.webview.min.js", 'quickapp')
    }
    if (!/toutiaomicroapp/i.test(userAgent) && !!document.querySelector('.post-message-section')) {
     document.querySelector('.post-message-section').style.visibility = 'visible';
    }
  },
  methods:{
    loadScript(jsURL,id) {
      if (document.getElementById(id)) {
        return;
      }
      const script = document.createElement('script');
      script.src = jsURL;
      script.id = id;
      script.type = 'text/javascript';
      document.body.appendChild(script);
    }
  }
}
</script>

<style scoped>

</style>
